<template>
    <div
        class="record"
        v-loading="loading"
        element-loading-text="拼命加载中"
        element-loading-spinner="el-icon-loading"
        element-loading-background="rgba(0, 0, 0, 0.8)"
    >
        <div class="record-box w1200">
            <!-- 1. 切换的tab -->
            <div class="tabs">
                <ul class="clearfix" v-if="isEditPage">
                    <li
                        v-for="(item, index) in tabsList"
                        :key="index"
                        :class="[active == index ? 'active' : '']"
                        @click="tabsHandClick(index)"
                    >
                        {{ item }}
                    </li>
                </ul>

                <ul class="clearfix" v-else>
                    <li v-for="(item, index) in tabsList" :key="index" :class="[active == index ? 'active' : '']">
                        {{ item }}
                    </li>
                </ul>
            </div>

            <!-- 2. tab 内容信息 -->
            <div class="apply-con">
                <!-- tab1 身份信息 -->
                <div class="card-info box" v-if="active == 0">
                    <el-form
                        :model="cardForm"
                        :rules="cardrules"
                        :inline="true"
                        ref="ruleForm"
                        label-width="100px"
                        class="demo-ruleForm form-group"
                        label-position="top"
                    >
                        <div class="title">基本信息</div>
                        <div class="bgf">
                            <el-form-item label="姓名" prop="username">
                                <el-input type="text" v-model="cardForm.username" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="身份证号" prop="idCard">
                                <el-input type="text" v-model="cardForm.idCard" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="联系电话" prop="telephone">
                                <el-input type="text" v-model="cardForm.telephone" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="户籍所在地" prop="register">
                                <el-input type="text" v-model="cardForm.register" :disabled="true"> </el-input>
                            </el-form-item>
                            <el-form-item label="邮箱" prop="mailbox">
                                <el-input type="text" v-model="cardForm.mailbox" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="文化程度">
                                <el-select v-model="cardForm.diploma" placeholder="" :disabled="true">
                                    <el-option v-for="item in cultureOptions" :key="item.value" :label="item.label" :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="身份证正面" prop="idCardUrlFront">
                                        <viewer :images="cardForm.idCardUrlFront">
                                            <img :src="cardForm.idCardUrlFront" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                    <el-form-item label="身份证反面" prop="idCardUrlReverse">
                                        <viewer :images="cardForm.idCardUrlReverse">
                                            <img :src="cardForm.idCardUrlReverse" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>
                        <div class="title">婚姻情况</div>
                        <div class="bgf">
                            <el-form-item label="婚姻情况">
                                <el-select v-model="cardForm.isMarried" placeholder="" :disabled="true">
                                    <el-option v-for="item in marriedOptions" :key="item.value" :label="item.label" :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="配偶姓名">
                                <el-input type="text" v-model="cardForm.mateName" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="配偶身份证">
                                <el-input type="text" v-model="cardForm.mateIdCard" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="配偶联系方式">
                                <el-input type="text" v-model="cardForm.mateTelephone" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="配偶月收入">
                                <el-input type="text" v-model="cardForm.mateIncome" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="配偶工作单位">
                                <el-input type="text" v-model="cardForm.mateUnit" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="居住情况">
                                <el-select v-model="cardForm.reside" placeholder="" :disabled="true">
                                    <el-option v-for="item in resideOptions" :key="item.value" :label="item.label" :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="家庭月收入">
                                <el-input type="text" v-model="cardForm.houseMouthIncome" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="家庭住址">
                                <el-input type="text" v-model="cardForm.houseAddress" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                        </div>
                        <div class="title">资产情况</div>
                        <div class="bgf">
                            <el-form-item label="是否有车">
                                <el-select v-model="cardForm.hasCar" placeholder="" :disabled="true">
                                    <el-option v-for="item in iscarOptions" :key="item.value" :label="item.label" :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>

                            <el-form-item label="车子型号">
                                <el-input type="text" v-model="cardForm.carModel" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="车子购买日期">
                                <el-date-picker v-model="cardForm.buyCarDate" type="date" placeholder="" :disabled="true"> </el-date-picker>
                            </el-form-item>
                            <el-form-item label="车牌号">
                                <el-input type="text" v-model="cardForm.carNo" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="车子情况">
                                <el-select v-model="cardForm.carstate" placeholder="" :disabled="true">
                                    <el-option v-for="item in carOptions" :key="item.value" :label="item.label" :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="是否有房">
                                <el-select v-model="cardForm.hasHouse" placeholder="" :disabled="true">
                                    <el-option v-for="item in hasHouseOptions" :key="item.value" :label="item.label" :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="房子情况">
                                <el-select v-model="cardForm.housestate" placeholder="" :disabled="true">
                                    <el-option v-for="item in carOptions" :key="item.value" :label="item.label" :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="房子购买日期">
                                <el-date-picker v-model="cardForm.buyHouseDate" type="date" placeholder="" :disabled="true">
                                </el-date-picker>
                            </el-form-item>
                            <el-form-item label="房屋面积">
                                <el-input type="text" v-model="cardForm.houseArea" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="房屋位置">
                                <el-input type="text" v-model="cardForm.houseLocation" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="上传行驶证正面">
                                        <viewer :images="cardForm.drivingLicenseUrl">
                                            <img :src="cardForm.drivingLicenseUrl" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>
                        <div class="title">银行卡信息</div>
                        <div class="bgf">
                            <el-form-item label="卡号">
                                <el-input type="number" v-model="cardForm.bankCardNo" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="开户行">
                                <el-input type="text" v-model="cardForm.openingBank" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="银行卡正面">
                                        <viewer :images="cardForm.bankCardUrl">
                                            <img :src="cardForm.bankCardUrl" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>
                        <div class="title">紧急联系人</div>
                        <div class="bgf">
                            <el-form-item label="姓名">
                                <el-input type="text" v-model="cardForm.emergencyContactName" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="电话">
                                <el-input
                                    type="number"
                                    v-model="cardForm.emergencyContactPhone"
                                    placeholder=""
                                    max-length="11"
                                    :disabled="true"
                                ></el-input>
                            </el-form-item>
                            <el-form-item label="关系">
                                <el-input
                                    type="text"
                                    v-model="cardForm.emergencyContactLocation"
                                    placeholder=""
                                    :disabled="true"
                                ></el-input>
                            </el-form-item>
                        </div>
                    </el-form>
                </div>

                <!-- tab2 价值信息 -->
                <div class="value-info box" v-if="active == 1">
                    <el-form
                        :model="valueForm"
                        :rules="valuerules"
                        :inline="true"
                        ref="valueruleForm"
                        label-width="100px"
                        class="demo-ruleForm form-group"
                        label-position="top"
                    >
                        <div class="title">规模</div>
                        <div class="bgf">
                            <el-form-item label="基地面积（亩）" prop="baseArea">
                                <el-input type="number" v-model="valueForm.baseArea" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="基地位置" prop="baseLocation">
                                <el-input type="text" v-model="valueForm.baseLocation" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="种植物品类" prop="plantspecies">
                                <el-input type="text" v-model="valueForm.plantspecies" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="种植年限" prop="plantYears">
                                <el-input type="number" v-model="valueForm.plantYears" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="种植数量" prop="plantNum">
                                <el-input type="number" v-model="valueForm.plantNum" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="每亩平均产量" prop="averageProduct">
                                <el-input type="text" v-model="valueForm.averageProduct" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                        </div>
                        <div class="title">租金情况</div>
                        <div class="bgf">
                            <el-form-item label="租金总额">
                                <el-input type="number" v-model="valueForm.rental" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="租金缴纳方式">
                                <el-input type="text" v-model="valueForm.rentPayWay" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="上传租恁合同(正面)">
                                        <viewer :images="valueForm.contractTenancy">
                                            <img :src="valueForm.contractTenancy" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                    <el-form-item label="上传房租缴纳凭证(正面)">
                                        <viewer :images="valueForm.payVoucher">
                                            <img :src="valueForm.payVoucher" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>
                        <div class="title">基础设施情况</div>
                        <div class="bgf">
                            <el-form-item label="道路情况">
                                <el-select v-model="valueForm.hasHighWay" placeholder="" :disabled="true">
                                    <el-option v-for="item in hasHighWayOptions" :key="item.value" :label="item.label" :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="道路建设投入">
                                <el-input type="text" v-model="valueForm.roadConstructionInto" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="水设施情况">
                                <el-input type="text" v-model="valueForm.waterFacility" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="水利建设投入">
                                <el-input type="text" v-model="valueForm.waterConstructionInto" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="基地仓库情况">
                                <el-input type="text" v-model="valueForm.baseWarehouse" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="仓库建设投入">
                                <el-input
                                    type="text"
                                    v-model="valueForm.warehouseConstructionInto"
                                    placeholder=""
                                    :disabled="true"
                                ></el-input>
                            </el-form-item>
                            <el-form-item label="基地建设情况">
                                <el-input type="text" v-model="valueForm.baseConstruction" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="基地建设投入">
                                <el-input type="text" v-model="valueForm.baseConstructionInto" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="加工配套情况">
                                <el-input
                                    type="text"
                                    v-model="valueForm.processSupportingFacility"
                                    placeholder=""
                                    :disabled="true"
                                ></el-input>
                            </el-form-item>
                            <el-form-item label="加工配套投入">
                                <el-input
                                    type="text"
                                    v-model="valueForm.processSupportingFacilityInto"
                                    placeholder=""
                                    :disabled="true"
                                ></el-input>
                            </el-form-item>
                        </div>
                    </el-form>
                </div>

                <!-- tab3 能力信息 -->
                <div class="power-info box" v-if="active == 2">
                    <el-form
                        :model="powerForm"
                        :rules="powerrules"
                        :inline="true"
                        ref="powerruleForm"
                        label-width="100px"
                        class="demo-ruleForm form-group"
                        label-position="top"
                    >
                        <div class="title">公司基础运营</div>
                        <div class="bgf">
                            <el-form-item label="公司员工数量" prop="staffNum">
                                <el-input type="number" v-model="powerForm.staffNum" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="公司专家数量" prop="expertNum">
                                <el-input type="number" v-model="powerForm.expertNum" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="月固定工资开支" prop="mouthSalarySpending">
                                <el-input type="number" v-model="powerForm.mouthSalarySpending" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="水费月均开支" prop="mouthWaterRateSpending">
                                <el-input
                                    type="number"
                                    v-model="powerForm.mouthWaterRateSpending"
                                    :disabled="true"
                                    placeholder=""
                                ></el-input>
                            </el-form-item>

                            <el-form-item label="电费月均开支" prop="mouthElectricRateSpending">
                                <el-input
                                    type="number"
                                    v-model="powerForm.mouthElectricRateSpending"
                                    placeholder=""
                                    :disabled="true"
                                ></el-input>
                            </el-form-item>

                            <el-form-item label="公司股东数量" prop="shareholderNum">
                                <el-input type="number" v-model="powerForm.shareholderNum" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="公司股东姓名" prop="shareholderNames">
                                <el-input type="text" v-model="powerForm.shareholderNames" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="公司股东占股情况" prop="shareholderRatio">
                                <el-input type="text" v-model="powerForm.shareholderRatio" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="上传水费缴纳凭证" prop="waterRatePayVoucher">
                                        <viewer :images="powerForm.waterRatePayVoucher">
                                            <img :src="powerForm.waterRatePayVoucher" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                    <el-form-item label="上传电费缴纳凭证" prop="electricRatePayVoucher">
                                        <viewer :images="powerForm.electricRatePayVoucher">
                                            <img :src="powerForm.electricRatePayVoucher" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                    <el-form-item label="上传营业执照" prop="businessLicense">
                                        <viewer :images="powerForm.businessLicense">
                                            <img :src="powerForm.businessLicense" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>
                        <div class="title">基地管理情况</div>
                        <div class="bgf">
                            <el-form-item label="基地化肥使用年投入">
                                <el-input
                                    type="text"
                                    v-model="powerForm.baseChemicalFertilizerYearIncome"
                                    placeholder=""
                                    :disabled="true"
                                ></el-input>
                            </el-form-item>
                            <el-form-item label="基地农药使用年投入">
                                <el-input
                                    type="text"
                                    v-model="powerForm.basePesticideYearIncome"
                                    placeholder=""
                                    :disabled="true"
                                ></el-input>
                            </el-form-item>
                            <el-form-item label="基地临时工年费用">
                                <el-input type="text" v-model="powerForm.baseDaylaborerYearFee" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                            <el-form-item label="基地种苗购买投入">
                                <el-input type="text" v-model="powerForm.baseGermchitBuyIncome" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                        </div>
                        <div class="title">基地收入情况</div>
                        <div class="bgf">
                            <el-form-item label="基地未来三年产量预估">
                                <el-input
                                    type="number"
                                    v-model="powerForm.baseFutureThreeYearOutput"
                                    placeholder=""
                                    :disabled="true"
                                ></el-input>
                            </el-form-item>
                            <el-form-item label="种植物每吨单价">
                                <el-input type="text" v-model="powerForm.plantsPertonPrice" placeholder="" :disabled="true"></el-input>
                            </el-form-item>
                        </div>
                        <div class="title">公司专利情况</div>
                        <div class="bgf">
                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="公司获得专利" style="width: 90%">
                                        <el-input
                                            type="textarea"
                                            v-model="powerForm.patentsOfCompany"
                                            :rows="2"
                                            placeholder=""
                                            :disabled="true"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item label="公司取得商标" style="width: 90%">
                                        <el-input
                                            type="textarea"
                                            v-model="powerForm.brandOfCompany"
                                            placeholder=""
                                            :disabled="true"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="上传专利">
                                        <viewer :images="powerForm.patentsUrl">
                                            <img :src="powerForm.patentsUrl" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>
                    </el-form>
                </div>

                <!-- tab4 历史信息 -->
                <div class="history-info box" v-if="active == 3">
                    <el-form
                        :model="historyForm"
                        :rules="historyrules"
                        :inline="true"
                        ref="historyruleForm"
                        label-width="100px"
                        class="demo-ruleForm form-group"
                        label-position="top"
                    >
                        <div class="title">公司荣誉情况</div>

                        <div class="bgf">
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="公司获得荣誉" style="width: 90%">
                                        <el-input
                                            type="textarea"
                                            v-model="historyForm.honorOfCompany"
                                            placeholder=""
                                            :disabled="true"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row> </el-row>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="上传公司荣誉证书" style="width: 90%">
                                        <viewer :images="historyForm.honorCertificateOfCompany">
                                            <img :src="historyForm.honorCertificateOfCompany" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="公司管理团队获得荣誉" style="width: 90%">
                                        <el-input
                                            type="textarea"
                                            v-model="historyForm.honorOfManagementTeam"
                                            placeholder=""
                                            :disabled="true"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row> </el-row>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="上传公司管理团队获得荣誉">
                                        <viewer :images="historyForm.honorCertificateOfManagementTeam">
                                            <img :src="historyForm.honorCertificateOfManagementTeam" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>
                        <div class="title">公司信用情况</div>

                        <div class="bgf">
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="上传公司征信上传" style="width: 90%">
                                        <viewer :images="historyForm.creditInvestigationOfCompany">
                                            <img :src="historyForm.creditInvestigationOfCompany" class="viewer_img" />
                                        </viewer>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row> </el-row>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="上传公司法人征信上传">
                                        <viewer :images="historyForm.creditInvestigationOfLegalPerson">
                                            <img :src="historyForm.creditInvestigationOfLegalPerson" class="viewer_img" />
                                        </viewer>
                                        <!--                                         
                                        <upload
                                            :img="historyForm.creditInvestigationOfLegalPerson"
                                            @update="updateCreditInvestigationOfLegalPerson"
                                        /> -->
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>
                    </el-form>
                </div>

                <!-- tab5 关系信息 -->
                <div class="relation-info box" v-if="active == 4">
                    <el-form
                        :model="relationForm"
                        :rules="relationrules"
                        :inline="true"
                        ref="relationruleForm"
                        label-width="100px"
                        class="demo-ruleForm form-group"
                        label-position="top"
                    >
                        <div class="title">公司前三大经销商</div>

                        <div class="bgf">
                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="公司第一大经销商名称">
                                        <el-input
                                            type="text"
                                            v-model="relationForm.firstDealerName"
                                            placeholder=""
                                            :disabled="true"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item label="年均采购数量、金额">
                                        <el-input
                                            type="text"
                                            v-model="relationForm.firstDealerNum"
                                            placeholder=""
                                            :disabled="true"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="公司第二大经销商名称">
                                        <el-input
                                            type="text"
                                            v-model="relationForm.secondDealerName"
                                            placeholder=""
                                            :disabled="true"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item label="年均采购数量、金额">
                                        <el-input
                                            type="text"
                                            v-model="relationForm.secondDealerNum"
                                            :disabled="true"
                                            placeholder=""
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="公司第三大经销商名称">
                                        <el-input
                                            type="text"
                                            v-model="relationForm.thirdDealerName"
                                            :disabled="true"
                                            placeholder=""
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item label="年均采购数量、金额">
                                        <el-input
                                            type="text"
                                            v-model="relationForm.thirdDealerNum"
                                            placeholder=""
                                            :disabled="true"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>
                        <div class="title">当地关系</div>

                        <div class="bgf">
                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="法人当地居住时间">
                                        <el-date-picker
                                            v-model="relationForm.legalPersonDwellTime"
                                            type="date"
                                            placeholder="选择日期"
                                            :disabled="true"
                                        >
                                        </el-date-picker>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item label="公司当地成立时间">
                                        <el-date-picker
                                            v-model="relationForm.companySetUpTime"
                                            type="date"
                                            placeholder="选择日期"
                                            :disabled="true"
                                        >
                                        </el-date-picker>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="公司是否获得经营权证">
                                        <el-select v-model="relationForm.hasManagerWarrant" placeholder="" :disabled="true">
                                            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item label="公司是否属于当地龙头企业">
                                        <el-select v-model="relationForm.isLeadingEnterprise" placeholder="" :disabled="true">
                                            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>
                        <div class="title">法人关系</div>

                        <div class="bgf">
                            <el-row>
                                <el-col :span="12">
                                    <el-form-item label="法人入股公司名称">
                                        <el-input
                                            type="text"
                                            v-model="relationForm.legalPersonOfCompanyName"
                                            placeholder=""
                                            :disabled="true"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item label="占股比例">
                                        <el-input
                                            type="text"
                                            v-model="relationForm.ratioOfShareHolding"
                                            placeholder=""
                                            :disabled="true"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="法人简介" style="width: 80%">
                                        <el-input
                                            type="textarea"
                                            v-model="relationForm.legalPersonInfo"
                                            placeholder=""
                                            :disabled="true"
                                        ></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </div>
                    </el-form>
                </div>
            </div>

            <!-- 3. 共用的 其他信息 -->
            <div style="margin: 30px 10px 60px 10px">
                  
                <div>
                    <span>其他信息</span>
                </div>

                <div style="margin: 30px 30px 60px 30px">
                    <el-form>
                        <el-row>
                            <el-col :span="4">
                                <div>
                                    确定额度: <span>{{ amount ? amount : '未确定' }}</span>
                                </div>
                            </el-col>
                            <el-col :span="4">
                                <div>
                                    放款状态: <span>{{ fangkuanStatus ? fangkuanStatus : '未放款' }}</span>
                                </div>
                            </el-col>
                        </el-row>

                        <el-row style="margin-top: 30px">
                            <el-col :span="16">
                                <el-col :span="6">
                                    <div v-if="riskReport">
                                        风控报告: <el-button type="primary" @click="downFile(riskReport)">下载查看</el-button>
                                    </div>
                                    <div v-else>风控报告: <el-button type="primary" :disabled="true">暂无风控报告</el-button></div>
                                </el-col>

                                <el-col :span="6">
                                    <div v-if="fangkuanVoucher">
                                        放款凭证: <el-button type="primary" @click="downFile(fangkuanVoucher)">下载查看</el-button>
                                    </div>
                                    <div v-else>放款凭证: <el-button type="primary" :disabled="true">暂无放款凭证</el-button></div>
                                </el-col>

                                <el-col :span="6">
                                    
                                    <div v-if="contract">
                                        合同: <el-button type="primary" @click="downFile(contract)">下载查看</el-button>
                                    </div>
                                    <div v-else>合同: <el-button type="primary" :disabled="true">暂无合同</el-button></div>
                                </el-col>
                            </el-col>
                        </el-row>
                    </el-form>
                </div>
            </div>

            <!-- 4. 审核操作 -->
            <div style="margin: 30px 10px 60px 10px">
                  
                <div>
                    <span>审核情况</span>
                </div>

                <!-- <el-row type="flex" justify="center">
                    <h1>审核步骤（暂缺）</h1>
                </el-row> -->

                <div style="margin: 30px 30px 60px 30px">
                    <el-row :gutter="8">
                        <el-col :span="6"> <div>审批人</div> </el-col>
                        <el-col :span="18">
                            <el-col :span="6"><div>审核状态</div></el-col>
                            <el-col :span="6"><div>审批时间</div></el-col>
                            <el-col :span="6"><div>审批原因</div></el-col>
                        </el-col>
                    </el-row>
                    <el-row :gutter="20" style="margin-top: 12px">
                        <el-col :span="6">
                            <!-- <el-steps direction="vertical" :active="1" :space="200">
                                <el-step v-for="(item, index) in flowLogRes" :key="index" :title="item.curApproverName"
                                    >{{ item.curApproverName }}
                                </el-step>
                            </el-steps> -->

                            <div v-for="(item, index) in flowLogRes" :key="index" :title="item.curApproverId" :style="item.style">
                                {{ item.curApproverId }}
                            </div>
                        </el-col>

                        <el-col :span="18">
                            <div v-for="(item, index) in flowLogRes" :key="index" :style="item.style">
                                <el-row>
                                    <el-col :span="6">
                                        <div>{{ item.status }}</div>
                                    </el-col>

                                    <el-col :span="6">
                                        <div>{{ item.approveTime }}</div>
                                    </el-col>

                                    <el-col :span="6">
                                        <div>{{ item.advise }}</div>
                                    </el-col>
                                </el-row>
                            </div>
                        </el-col>
                    </el-row>
                </div>

                <div v-if="this.opShow">
                    <!-- 基地商户管理审批 专用 -->
                    <div v-if="this.pageFlag === '基地商户管理-审批详情'">
                        <el-form
                            :inline="false"
                            :model="zdshspForm"
                            size="mini"
                            class="demo-form-inline"
                            label-width="120px"
                            ref="ruleForm"
                        >
                            <el-form-item label="审核原因">
                                <el-input v-model="zdshspForm.checkReason" placeholder="审核原因" type="textarea"></el-input>
                            </el-form-item>
                        </el-form>
                    </div>

                    <!-- 风控管理审批 专用 -->
                    <div v-if="this.pageFlag === '风控管理-审批详情'">
                        <el-form :inline="false" :model="fkspForm" size="mini" class="demo-form-inline" label-width="120px" ref="ruleForm">
                            <el-form-item v-if="reportShow" label="上传风控报告">

                                <moreUpFile
                                    :isShowFileList="true"
                                    @moreUpFileSuccessHandle="moreUpFileSuccessHandle"
                                    @moreUpFileErrorHandle="moreUpFileErrorHandle"
                                    @moreUpFileHandlePreview="moreUpFileHandlePreview"
                                >
                                </moreUpFile>

                                <!-- <upload :img.sync="fkspForm.report" @update="fkspReportupdate" /> -->
                            </el-form-item>

                            <el-row v-if="nextCheckManShow">
                                <el-col :span="12">
                                    <el-form-item label="选择资金方">
                                        <el-select v-model="fkspForm.nextCheckMan" placeholder="请选择">
                                            <el-option
                                                v-for="item in zjfChooseList"
                                                :key="item.userId"
                                                :label="item.userName"
                                                :value="item.userId"
                                            >
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-form-item label="审核原因">
                                <el-input v-model="fkspForm.checkReason" placeholder="审核原因" type="textarea"></el-input>
                            </el-form-item>
                        </el-form>
                    </div>

                    <!-- 资金管理审批 专用 -->
                    <div v-if="this.pageFlag === '资金管理-审批详情'">
                        <el-form :inline="false" :model="zjspForm" size="mini" class="demo-form-inline" label-width="120px">
                            <el-form-item label="放款状态">
                                <el-radio v-if="!zjfFkShow" v-model="zjspForm.fangkuanStatus" label="0">未放款</el-radio>
                                <el-radio v-if="zjfFkShow" v-model="zjspForm.fangkuanStatus" label="1">已放款</el-radio>
                            </el-form-item>

                            <el-form-item label="审核原因">
                                <el-input v-model="zjspForm.checkReason" placeholder="审核原因" type="textarea"></el-input>
                            </el-form-item>

                            <el-form-item v-if="zjfFkShow && zjfShowContract" label="">
                                <el-button type="primary" @click="downFile(zjfShowContractId)">{{ showContract }}</el-button>
                            </el-form-item>

                            <el-form-item label="放款凭证" v-if="zjfFkShow">
                                <upload :img.sync="zjspForm.voucher" @update="zjspVoucherUpdate" />
                            </el-form-item>

                            <el-form-item label="确定额度" v-if="zjfAmountShow">
                                <el-row>
                                    <el-col :span="12">
                                        <el-input v-model="zjspForm.amount" type="text" placeholder="请输入确认额度"></el-input>
                                    </el-col>
                                </el-row>
                            </el-form-item>
                        </el-form>
                    </div>

                    <el-row type="flex" justify="center">
                        <div>
                            <span slot="footer">
                                <el-button type="primary" @click="dataFormSubmit(1)">通过</el-button>
                                <el-button type="primary" @click="dataFormSubmit(2)">驳回</el-button>

                                <el-button v-if="noAmountShow" type="primary" @click="dataFormSubmit(3)">无金额额度</el-button>
                                <el-button @click="closePage()">取消</el-button>
                            </span>
                        </div>
                    </el-row>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import API from '@/api';
import upload from '../../components/upLoad';
import moreUpFile from '../../components/upLoad/moreUpFile';

import { version } from 'element-ui';

export default {
    components: {
        upload,
        moreUpFile
    },
    data() {
        return {
            //页面专用
            pageFlag: '',

            // tab切换专用
            active: 0,
            tabsList: ['填写身份信息', '填写价值信息', '填写能力信息', '填写历史信息', '填写关系信息'],

            //tab 1: 身份信息
            cardForm: {
                bankCardNo: '', // 银行卡号
                openingBank: '', // 银行开户行
                drivingLicenseUrl: '', //行驶证图片
                idCardUrlFront: 'http://222.181.11.141:7081/byjz-ia/sys/file/showpic?id=92d7b7c862ed4a9b935ddf6c0c06f919', // 身份证正面
                idCardUrlReverse: 'http://222.181.11.141:7081/byjz-ia/sys/file/showpic?id=92d7b7c862ed4a9b935ddf6c0c06f919', //身份证反面
                username: '', //姓名
                idCard: '', //身份证号
                telephone: '', //联系电话
                mailbox: '', //邮箱
                register: '', //户籍所在地
                diploma: '', //文化程度
                mateUnit: '', //婚姻情况:配偶工作单位
                mateTelephone: '', //婚姻情况:配偶联系方式
                mateName: '', //婚姻情况:配偶姓名
                mateIncome: '', // 婚姻情况:配偶收入
                mateIdCard: '', //婚姻情况:配偶身份证号码
                houseAddress: '', //婚姻情况:家庭住址
                reside: '', // 婚姻情况:居住情况
                houseMouthIncome: '', // 婚姻情况:家庭月收入
                hasCar: '', // 是否有车
                carstate: '', // 车子情况
                carModel: '', //车子型号
                carNo: '', //资产情况:车牌号
                buyCarDate: '', //车子购买日期
                buyHouseDate: '', // 房子购买日期
                housestate: '', //:房子情况
                hasHouse: '', //是否有房
                houseArea: '', //房屋面积
                houseLocation: '', //房屋位置
                emergencyContactLocation: '', //紧急联系人:关系
                emergencyContactName: '', //紧急联系人:姓名
                emergencyContactPhone: '' //紧急联系人:电话
            },

            // 是否结婚
            marriedOptions: [
                {
                    value: '1',
                    label: '已婚'
                },
                {
                    value: '0',
                    label: '未婚'
                }
            ],
            // 居住情况
            resideOptions: [
                {
                    value: '自主房屋',
                    label: '自主房屋'
                },
                {
                    value: '租房',
                    label: '租房'
                }
            ],
            // 是否有房
            hasHouseOptions: [
                {
                    value: '0',
                    label: '无房'
                },
                {
                    value: '1',
                    label: '有房'
                }
            ],
            // 车子情况
            carOptions: [
                {
                    value: '全款',
                    label: '全款'
                },
                {
                    value: '按揭',
                    label: '按揭'
                }
            ],
            iscarOptions: [
                {
                    value: '0',
                    label: '无车'
                },
                {
                    value: '1',
                    label: '有车'
                }
            ],
            // 文化程度
            cultureOptions: [
                {
                    value: '博士',
                    label: '博士'
                },
                {
                    value: '研究生',
                    label: '研究生'
                },
                {
                    value: '本科',
                    label: '本科'
                },
                {
                    value: '大专',
                    label: '大专'
                },
                {
                    value: '中专',
                    label: '中专'
                },
                {
                    value: '高中',
                    label: '高中'
                },
                {
                    value: '初中',
                    label: '初中'
                },
                {
                    value: '小学',
                    label: '小学'
                },
                {
                    value: '成人教育',
                    label: '成人教育'
                }
            ],
            options: [
                {
                    value: '是',
                    label: '是'
                },
                {
                    value: '否',
                    label: '否'
                }
            ],
            hasHighWayOptions: [
                {
                    value: '0',
                    label: '无公路'
                },
                {
                    value: '1',
                    label: '有公路'
                }
            ],

            //tab 2: 价值信息
            valueForm: {
                baseLocation: '光电园001', //规模:基地位置
                baseArea: '32.45', //基地面积
                plantspecies: '56', //种植物品类
                plantYears: '100', //种植年限
                plantNum: '50', //规模:种植数量
                averageProduct: '60', //规模:每亩平均产量
                rentPayWay: '', //租金情况:租金缴纳方式
                rental: '', //租金情况:租金总额
                payVoucher: '', //房租缴纳凭证图片
                contractTenancy: '', //上传租恁合同
                hasHighWay: '', //是否有公路
                roadConstructionInto: '', //基础设施情况:道路建设投入
                waterFacility: '', //基础设施情况:水利设施情况
                waterConstructionInto: '', //基础设施情况:水利建设投入
                baseWarehouse: '', //基础设施情况:基地仓库情况
                warehouseConstructionInto: '', //仓库建设投入
                baseConstruction: '', //基地建设情况
                baseConstructionInto: '', //基地建设投入
                processSupportingFacility: '', //基础设施情况:加工配套情况
                processSupportingFacilityInto: '' //加工配套投入
            },

            // tab 3: 能力信息
            powerForm: {
                staffNum: '60', //公司员工数量
                expertNum: '70', //公司专家数量
                mouthSalarySpending: '100', //月固定工资
                mouthWaterRateSpending: '20', // 水费月均开支
                mouthElectricRateSpending: '30', // 公司基础运营:电费月均开支
                shareholderNames: '王小明', //公司基础运营:公司股东姓名
                shareholderNum: '60', //公司基础运营:公司股东数量
                shareholderRatio: '20', //公司基础运营:公司股东占股情况
                waterRatePayVoucher: '', //公司基础运营:水费缴纳凭证
                electricRatePayVoucher: '', //公司基础运营:电费缴纳凭证
                businessLicense: '', //公司基础运营:营业执照
                baseChemicalFertilizerYearIncome: '', //基地化肥使用年投入
                basePesticideYearIncome: '', //基地农药使用年投入
                baseDaylaborerYearFee: '', //基地农药使用年投入
                baseGermchitBuyIncome: '', //基地种苗购买投入
                baseFutureThreeYearOutput: '', //基地未来三年产量预估
                plantsPertonPrice: '', //种植物每吨单价
                patentsOfCompany: '', //公司获得专利
                brandOfCompany: '' //公司获得的商标
            },

            // tab 4: 历史信息
            historyForm: {
                honorCertificateOfCompany: '', //上传公司荣誉证书
                honorCertificateOfManagementTeam: '', //上传团队荣誉证书
                honorOfCompany: '', //公司获得荣誉
                honorOfManagementTeam: '', //公司管理团队获得荣誉
                creditInvestigationOfCompany: '', //公司征信上传
                creditInvestigationOfLegalPerson: '' //公司法人征信上传
            },
            historyrules: {},

            // tab 5: 关系信息
            relationForm: {
                firstDealerName: '', //公司第一大经销商名称
                firstDealerNum: '', //第一大经销商年均采购数量、金额

                secondDealerName: '', //公司第二大经销商名称
                secondDealerNum: '', //第二大经销商年均采购数量、金额

                thirdDealerNum: '', //第三大经销商年均采购数量、金额
                thirdDealerName: '', //公司第三大经销商名称

                legalPersonDwellTime: '', //法人当地居住时间
                companySetUpTime: '', //公司当地成立时间
                isLeadingEnterprise: '', //:公司是否属于当地龙头企业
                hasManagerWarrant: '', //公司是否获取经营权证

                legalPersonInfo: '', //法人简介
                legalPersonOfCompanyName: '', //法人入股公司名称
                ratioOfShareHolding: '' //占股比例
            },
            relationrules: {},
            cardUpUrl: this.baseUrl + '/sys/file/uploadIdCard',
            loading: false,
            isEditPage: true, //是否是编辑页面
            pageId: '',

            //-审批情况
            flowLogRes: [],

            //基地商户管理-审批
            zdshspForm: {
                checkReason: ''
            },

            //风控管理-审批
            fkspForm: {
                report: '',
                nextCheckMan: '',
                checkReason: ''
            },
            reportShow: false,
            nextCheckManShow: false,
            zjfChooseList: [],

            zjspForm: {
                //资金管理-审批
                fangkuanStatus: '0',
                voucher: '',
                amount: '',
                checkReason: ''
            },
            zjfShowContractId: '',
            zjfShowContract: false,
            showContract: '查看合同',
            zjfAmountShow: false,
            zjfFkShow: false,
            noAmountShow: false,
            opShow: true,

            //-其他 公用显示
            amount: undefined, //确定额度
            riskReport: undefined, //风控报告
            fangkuanStatus: undefined, //放款状态
            fangkuanVoucher: undefined, //放款凭证
            contract: undefined //合同
        };
    },

    watch: {
        //- 解决 同一页面，数据不刷新问题

        // 监听相同路由下参数变化的时候，从而实现异步刷新
        $route(to, from) {
            this.nickname = this.$route.query.nickname; //修改页面标题
            switch (this.$route.path) {
                case '/publicProcessApproval/jdshgl/auditDetails':
                    //基地商户管理  审批详情
                    this.pageFlag = '基地商户管理-审批详情';

                    break;
                case '/publicProcessApproval/fkgl/auditDetails':
                    //风控管理 审批详情
                    this.pageFlag = '风控管理-审批详情';
                    break;

                case '/publicProcessApproval/zjgl/auditDetails':
                    //资金管理 审批详情
                    this.pageFlag = '资金管理-审批详情';

                    break;
            }
        }
    },

    mounted() {
        var itemData = this.$route.query.itemData;

        switch (this.$route.path) {
            case '/publicProcessApproval/jdshgl/auditDetails':
                //基地商户管理  审批详情
                this.pageFlag = '基地商户管理-审批详情';

                break;

            case '/publicProcessApproval/fkgl/auditDetails':
                //风控管理 审批详情
                this.pageFlag = '风控管理-审批详情';
                this.getZjfChooseList();
                break;

            case '/publicProcessApproval/zjgl/auditDetails':
                //资金管理 审批详情
                this.pageFlag = '资金管理-审批详情';

                break;
        }

        this.pageId = itemData.id;
        this.getDetail(itemData.id, itemData.opFlag);
    },
    methods: {
        // 获取编辑详情

        getDetail(id, opFlag) {
            let params = {
                id: id //消息主键
            };

            var _that = this;
            API.publicProcessApproval.getAuditDetails(params).then((res) => {
                console.log(res);
                if (res.code == '0000') {
                    var data = res.result;
                    var cardForm = _that.cardForm; // 基本信息
                    var valueForm = _that.valueForm; // 价值信息
                    var powerForm = _that.powerForm;
                    var historyForm = _that.historyForm;
                    var relationForm = _that.relationForm;

                    Object.keys(cardForm).forEach((key) => {
                        console.log(key);
                        cardForm[key] = data[key];
                    });

                    Object.keys(relationForm).forEach((key) => {
                        console.log(key);
                        relationForm[key] = data[key];
                    });
                    Object.keys(valueForm).forEach((key) => {
                        console.log(key);
                        valueForm[key] = data[key];
                    });
                    Object.keys(powerForm).forEach((key) => {
                        console.log(key);
                        powerForm[key] = data[key];
                    });
                    Object.keys(historyForm).forEach((key) => {
                        console.log(key);
                        historyForm[key] = data[key];
                    });

                    _that.cardForm = cardForm;
                    //身份信息 ：选择处理
                    if (_that.cardForm.isMarried === 0) {
                        //婚姻情况
                        _that.cardForm.isMarried = '0';
                    } else if (_that.cardForm.isMarried === 1) {
                        _that.cardForm.isMarried = '1';
                    }

                    if (_that.cardForm.hasCar === 0) {
                        //是否有车
                        _that.cardForm.hasCar = '0';
                    } else if (_that.cardForm.hasCar === 1) {
                        _that.cardForm.hasCar = '1';
                    }

                    if (_that.cardForm.hasHouse === 0) {
                        //是否有房
                        _that.cardForm.hasHouse = '0';
                    } else if (_that.cardForm.hasHouse === 1) {
                        _that.cardForm.hasHouse = '1';
                    }

                    _that.valueForm = valueForm;
                    //价值信息：选择处理
                    if (_that.valueForm.hasHighWay === 0) {
                        //道路情况
                        _that.valueForm.hasHighWay = '0';
                    } else if (_that.valueForm.hasHighWay === 1) {
                        _that.valueForm.hasHighWay = '1';
                    }

                    _that.powerForm = powerForm;
                    _that.historyForm = historyForm;
                    _that.relationForm = relationForm;

                    _that.flowLogRes = data.flowLogRes; //审批情况 审批流程列表
                    for (let index = 0; index < _that.flowLogRes.length; index++) {
                        let element = _that.flowLogRes[index];

                        //样式处理
                        if (index == 0) {
                            element.style = 'margin-top: 0px;';
                        } else {
                            element.style = 'margin-top: 40px;';
                        }

                        //审核状态处理
                        switch (element.status) {
                            // 审核状态：2-已提交 3-已提交  4-审核驳回 5-审核通过
                            case 2:
                                element.status = '待处理';
                                break;
                            case 3:
                                element.status = '已提交';
                                break;
                            case 4:
                                element.status = '审核驳回';
                                break;
                            case 5:
                                element.status = '审核通过';
                                break;
                        }
                    }

                    //- 风控管理-审批详情
                    if (this.pageFlag === '风控管理-审批详情') {
                        //是否显示 上传风控报告
                        if (data.approveAction != null && data.approveAction === 'UP_CONTACT') {
                            this.reportShow = true;
                        }
                        if (data.approveAction != null && data.approveAction === 'EDIT_CONTACT') {
                            this.reportShow = true;
                        }

                        //选择资金方显示处理
                        // this.nextCheckManShow = true;
                        if (data.approveAction != null && data.approveAction === 'ASSIGN_APPROVER') {
                            this.nextCheckManShow = true;
                        }

                        if (data.approveAction != null && data.approveAction === 'ZERO_ASSIGN_ZJ') {
                            this.nextCheckManShow = true;
                        }
                    } else if (this.pageFlag === '资金管理-审批详情') {
                        //确定额度显示
                        if (data.approveAction != null && data.approveAction === 'ZERO') {
                            this.zjfAmountShow = true;
                        }

                        //查看合同处理
                        if (data.contract != null && data.contract !== '') {
                            this.zjfShowContractId = data.contract;
                            this.zjfShowContract = true;
                        }

                        //放款显示：放款凭证显示，放款状态 已放款显示。
                        if (data.approveAction != null && data.approveAction === 'LOAN_APPROVE') {
                            this.zjfFkShow = true;
                        }
                    }

                    //审批完成隐藏所有操作按钮
                    if (data.flowStatusEnumStr != null && data.flowStatusEnumStr === '审核通过(完成)') {
                        this.opShow = false;
                    }

                    //详情进入隐藏所有操作按钮
                    if (opFlag === '1') {
                        this.opShow = false;
                    }

                    //无金额 额度 显示
                    if (this.pageFlag !== '基地商户管理-审批详情') {
                        this.noAmountShow = true;

                        if (data.approveAction != null && data.approveAction === 'LOAN_APPROVE') {
                            this.noAmountShow = false;
                        }
                    }

                    //-其他 公用显示
                    this.amount = res.result.amount;
                    this.riskReport = res.result.riskReport;
                    this.fangkuanStatus = res.result.fangkuanStatus;
                    this.fangkuanVoucher = res.result.fangkuanVoucher;
                    this.contract = res.result.contract;
                }
                _that.loading = false;
            });
        },

        // 列表 接口
        getZjfChooseList() {
            let params = {};
            params.pageNum = 1;
            params.pageSize = 1000;

            API.publicProcessApproval.zjfInfoList(params).then((res) => {
                console.log(res);
                this.zjfChooseList = res.result.rows;
            });
        },

        //查看合同
        downFile(downId) {
            var reg=new RegExp('http://');

            if(reg.test(downId)){

                var idIndex=downId.indexOf("id=");
                var idStr=downId.substring(idIndex,downId.length);

                 if(idStr.indexOf("id=")!=-1){
                     window.location.href =window.baseUrl + '/sys/file/new/down?TOKEN=' + sessionStorage.getItem('token') +'&'+ idStr;
                 }
                
            }else{
                window.location.href = window.baseUrl + '/sys/file/new/down?TOKEN=' + sessionStorage.getItem('token') + '&id=' + downId;
            }
          
        },

        // 选 项卡切换
        tabsHandClick(index) {
            this.active = index;
            if (this.$refs.powerruleForm) {
                this.$refs.powerruleForm.clearValidate();
            }
            if (this.$refs.ruleForm) {
                this.$refs.ruleForm.clearValidate();
            }
            if (this.$refs.historyruleForm) {
                this.$refs.historyruleForm.clearValidate();
            }
            if (this.$refs.relationruleForm) {
                this.$refs.relationruleForm.clearValidate();
            }
            if (this.$refs.valueruleForm) {
                this.$refs.valueruleForm.clearValidate();
            }
        },

        //#上传控件专用

        // 上传银行卡图片
        updateBank(img) {
            this.cardForm.imgUrl = img;
        },
        // 上传行驶证
        updateDrivingLicenseUrl(img) {
            this.cardForm.drivingLicenseUrl = img;
        },
        // 身份证正面
        updateCardFront(img) {
            this.cardForm.idCardUrlFront = img;
        },
        // 身份证反面
        updateCardreverse(img) {
            this.cardForm.idCardUrlReverse = img;
        },
        // 租房合同图片
        updatecontractTenancy(img) {
            this.valueForm.contractTenancy = img;
        },
        //上传房租缴纳凭证
        updatepayVoucher(img) {
            this.valueForm.payVoucher = img;
        },
        // 上传水费缴纳凭证
        updateWaterFee(img) {
            this.powerForm.waterRatePayVoucher = img;
        },
        // 上传电费缴纳凭证
        updateelectricityFee(img) {
            this.powerForm.electricRatePayVoucher = img;
        },
        // 上传营业执照
        updateOpenPhotp(img) {
            this.powerForm.businessLicense = img;
        },
        // 上传公司征信
        updateCreditInvestigationOfCompany(img) {
            this.historyForm.creditInvestigationOfCompany = img;
        },
        //公司法人征信上传
        updateCreditInvestigationOfLegalPerson(img) {
            this.historyForm.creditInvestigationOfLegalPerson = img;
        },
        // 上传专利(可以多张)
        updatePatentsUrl(img) {
            this.powerForm.patentsOfCompany = img.join(',');
        },
        // 上传团队荣誉证书(可以多张)
        updateHonorCertificateOfManagementTeam(img) {
            this.historyForm.honorCertificateOfManagementTeam = img.join(',');
        },
        //上传公司荣誉证书
        updateHonorCertificateOfManagementTeam(img) {
            this.historyForm.honorCertificateOfCompany = img.join(',');
        },

        //上传风控报告 成功回调
        moreUpFileSuccessHandle([url,sigleImgId,response,file,fileList]) {
            this.fkspForm.report = sigleImgId;
            console.log("上传id：",sigleImgId);
        },
        //上传风控报告 失败回调
        moreUpFileErrorHandle(val){
            this.$message.error(`文件上传失败`);

        },
        
        //上传风控报告 文件预览回调
        moreUpFileHandlePreview(file){
            console.log("文件预览回调",file);
            window.location.href = window.baseUrl + '/sys/file/new/down?TOKEN=' + 
            sessionStorage.getItem('token') + '&id=' + file.response.result[0];

        },

        //上传放款凭证
        zjspVoucherUpdate(img) {
            this.zjspForm.voucher = img;
        },

        closePage() {
            this.$router.go(-1);
        },
        // 通过 或 驳回 或 无金额额度
        dataFormSubmit(type) {
            if ((type == 1) | (type == 2)) {
                var params = {
                    action: type == 1 ? 0 : 1,
                    id: this.pageId
                };

                if (this.pageFlag === '风控管理-审批详情') {
                    // 驳回
                    if (type == 2 && this.fkspForm.checkReason == '') {
                        this.$message.error('请填写审核原因');
                        return;
                    }

                    //上传验证
                    if (this.reportShow == true && this.fkspForm.report == '' && type==1) {
                        this.$message.error('请上传风控报告');
                        return;
                    }

                    //资金方验证
                    if (this.nextCheckManShow == true && this.fkspForm.nextCheckMan == '' && type==1) {
                        this.$message.error('请选择资金方');
                        return;
                    }

                    params.report = this.fkspForm.report; //风控报告
                    params.nextCheckMan = this.fkspForm.nextCheckMan; //选择资金方
                    params.checkReason = this.fkspForm.checkReason; //审批原因
                } else if (this.pageFlag === '资金管理-审批详情') {
                    // 驳回
                    if (type == 2 && this.zjspForm.checkReason == '') {
                        this.$message.error('请填写审核原因');
                        return;
                    }

                    //上传验证
                    if (this.zjfFkShow == true && this.zjspForm.voucher == '' && type==1) {
                        this.$message.error('请上传放款凭证');
                        return;
                    }

                    params.fangkuanStatus = this.zjspForm.fangkuanStatus; //放款状态
                    params.voucher = this.zjspForm.voucher; //放款凭证
                    params.amount = this.zjspForm.amount; //确定额度
                    params.checkReason = this.zjspForm.checkReason; //审批原因
                } else if (this.pageFlag === '基地商户管理-审批详情') {
                    // 驳回
                    if (type == 2 && this.zdshspForm.checkReason == '') {
                        this.$message.error('请填写审核原因');
                        return;
                    }

                    params.checkReason = this.zdshspForm.checkReason; //审批原因
                }

                API.publicProcessApproval.approveOrRejectAudit(params).then((data) => {
                    if (data.code == '0000') {
                        this.$message({
                            message: '操作成功',
                            type: 'success',
                            duration: 1500,
                            onClose: () => {
                                this.$router.go(-1);
                            }
                        });
                    }
                });
            } else if (type == 3) {
                var params = {
                    action: type == 1 ? 0 : 1,
                    id: this.pageId
                };

                if (this.pageFlag === '风控管理-审批详情') {
                    params.report = this.fkspForm.report; //风控报告
                    params.checkReason = this.fkspForm.checkReason; //审批原因
                } else if (this.pageFlag === '资金管理-审批详情') {
                    params.fangkuanStatus = this.zjspForm.fangkuanStatus; //放款状态
                    params.voucher = this.zjspForm.voucher; //放款凭证
                    params.checkReason = this.zjspForm.checkReason; //审批原因
                }

                API.publicProcessApproval.noMoneyAudit(params).then((data) => {
                    if (data.code == '0000') {
                        this.$message({
                            message: '操作成功',
                            type: 'success',
                            duration: 1500,
                            onClose: () => {
                                this.$router.go(-1);
                            }
                        });
                    }
                });
            }
        }
    }
};
</script>
<style  scoped>
.tabs {
    background: #fff;
    height: 52px;
    margin-top: 10px;
}
.tabs ul li {
    float: left;
    width: 100px;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.85);
    line-height: 32px;
    margin-left: 60px;
    cursor: pointer;
    margin-top: 10px;
}
.tabs ul li:hover {
    color: #f48d06;
}
.tabs ul li.active {
    color: #f48d06;
    border-bottom: 3px solid #f48d06;
}
.box {
    min-height: 300px;
    margin-top: 30px;
}
.title {
    line-height: 35px;
    font-size: 16px;
    color: #4a4a4a;
    position: relative;
    margin-left: 50px;
    margin-top: 20px;
}
.title::before {
    position: absolute;
    width: 5px;
    height: 20px;
    background: #f48d06;
    border-radius: 2px;
    content: ' ';
    top: 5px;
    left: -10px;
}

.form-group {
    width: 1200px;
}
</style>
<style>
.form-group .el-input__inner {
    width: 219px;
    line-height: 32px;
    border-radius: 2px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    padding-left: 10px;
    box-sizing: border-box;
}
.form-group .el-form-item__label {
    margin-bottom: 0;
    padding-bottom: 0;

    color: rgba(0, 0, 0, 0.85);
    font-size: 14px;
}
.form-group .el-form-item {
    margin-right: 32px;
}
.bgf {
    background: #ffffff;
    width: 1080px;
    padding: 20px;
    margin: 5px auto;
}
.next-btn {
    width: 159px;
    height: 44px;
    background: #f48d06;
    border-radius: 2px;
    color: #fff;
}
.next-btn:hover {
    opacity: 0.8;
    background: #f48d06;
    border-radius: 2px;
    color: #fff;
}
.cancle {
    width: 159px;
    height: 44px;
    background: #ffffff;
    border-radius: 2px;
    border: 1px solid #f48d06;
    color: #f48d06;
    margin-left: 60px !important;
}
.cancle:hover {
    opacity: 0.8;
    background: #f48d06;
    border-radius: 2px;
    color: #fff;
}
.form-group .el-textarea {
    width: 100%;
}
.form-group .el-textarea__inner {
    width: 100%;
}
.viewer_img {
    position: relative;
    width: 100px;
    height: 100px;
}
</style>